<!-- 本体预览页面 -->
<script src="../../../static/header.js" charset="UTF-8" id="importByHead" top="本体模型" left="本体预览"></script>
<div class="layui-side layui-bg-black">
    <div class="layui-side-scroll">
        <!-- 菜单缩放 -->
        <div class="kit-side-fold"></div>
        <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
        <ul class="layui-nav layui-nav-tree" lay-filter="test">
            <li class="layui-nav-item layui-nav-itemed">
                <a href=""> <span>股票</span></a>
            </li>
            <li class="layui-nav-item">
                <a href="/index/convbond/"> <span>债券</span></a>
            </li>
            <li class="layui-nav-item">
                <a href=""> <span>基金</span></a>
            </li>
        </ul>
    </div>
</div>

<script src="/static/layui/layui.js" charset="utf-8"></script>
<script>
    //JavaScript代码区域
    layui.use(['element', 'jquery'], function() {
        var element = layui.element;
        $ = layui.$
        var isShow = true; //定义一个标志位
        $('.kit-side-fold').click(function() {
            //选择出所有的span，并判断是不是hidden
            $('.layui-nav-item span').each(function() {
                if ($(this).is(':hidden')) {
                    $(this).show();
                } else {
                    $(this).hide();
                }
            });
            //判断isshow的状态
            if (isShow) {
                $('.layui-side.layui-bg-black').width(0); //设置宽度
                $('.kit-side-fold i').css('margin-right', '70%'); //修改图标的位置
                //将footer和body的宽度修改
                $('.layui-body').css('left', 00 + 'px');
                $('.layui-footer').css('left', 00 + 'px');
                //将二级导航栏隐藏
                $('dd span').each(function() {
                    $(this).hide();
                });
                //修改标志位
                isShow = false;
            } else {
                $('.layui-side.layui-bg-black').width(160);
                $('.kit-side-fold i').css('margin-right', '10%');
                $('.layui-body').css('left', 160 + 'px');
                $('.layui-footer').css('left', 160 + 'px');
                $('dd span').each(function() {
                    $(this).show();
                });
                isShow = true;
            }
        });
    });
</script>
<!--    内容主体-->
<div class="layui-body">

    <table class="layui-hide" id="test"></table>
    <script type="text/html" id="switch_flag">
        <!-- 这里的 checked 的状态只是演示 -->
        <!-- verbatim用于django逐字翻译 -->
        {% verbatim %}<input type="checkbox" name={{d.acode}} value={{d.flag}} flag="{{d.flag}}" lay-skin="switch" lay-text="开启|关闭" lay-filter="flag_filter" {{ d.flag==1? 'checked' : '' }}> {% endverbatim %}
    </script>
    <script>
        layui.config({
            base: "/static/tablePlug/"
        }).use(['tablePlug', 'jquery'], function() {
            var table = layui.table,
                form = layui.form;
            table.render({
                elem: '#test',
                url: '/index/api/stack_data/?format=json',
                loading: false,
                smartReloadModel: true,
                cols: [
                    [{
                        field: 'acode',
                        title: 'A股编号',
                        sort: true
                    }, {
                        field: 'name',
                        title: '名称',
                        style: 'color:red;font-weight:bold;font-size:8'
                    }, {
                        field: 'time',
                        title: '时间'
                    }, {
                        field: 'hbuy1',
                        title: 'H买1',
                        sort: true
                    }, {
                        field: 'hsell1',
                        title: 'H卖1'
                    }, {
                        field: 'abuy1',
                        title: 'A买1',
                        sort: true
                    }, {
                        field: 'asell1',
                        title: 'A卖1'
                    }, {
                        field: 'turnover',
                        title: '成交量'
                    }, {
                        field: '20mean',
                        title: '20天平均'
                    }, {
                        field: 'AS:HB',
                        title: 'A卖:H买'
                    }, {
                        field: 'AS:HB_dep',
                        title: '偏离'
                    }, {
                        field: 'AB:HS',
                        title: 'A买:H卖'
                    }, {
                        field: 'AB:HS_dep',
                        title: '偏离'
                    }, {
                        field: 'state',
                        title: '状态'
                    }, {
                        field: 'flag',
                        title: '监控状态',
                        templet: '#switch_flag',
                        sort: true,
                    }],
                ]
            });
            form.on('switch(flag_filter)', function(obj) {
                console.log(this.name)
                console.log(this.value)
                layui.$.ajax({
                    url: '/index/api/stack/' + this.name + '/',
                    type: 'PATCH',
                    data: {
                        "s_flag_refresh": this.value == 0 ? 1 : 0
                    }
                })
            });
            // // 周期刷新代碼
            // function do_while() {
            //     setInterval(function() {
            //         table.reload("test")
            //     }, 1000)
            // }
            // do_while()

        });
    </script>
</div>
<!-- 设置列高 -->
<style type="text/css">
    .layui-table-cell {
        height: auto;
        line-height: 16px;
    }
</style>

<script src="../../../static/tail.js" charset="UTF-8"></script>